<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="../css/demo.css" />
    
    <title>Jslet - 惊鸿一瞥</title>
    <script type="text/javascript" data-main="../config.js" src="../lib/requirejs/require.min.js"></script>
    <script type="text/javascript">
	    require(['glance/glance']);
    </script>
</head>
<body>
    <div class="demo-header">
    <h3 id="top">Jslet - 惊鸿一瞥</h3>
	</div>
	<hr />
	<div class="content">
	<p>100行Javascript代码能做什么？那么30行代码呢？</p>
	<p>使用Jslet，可以实现一个完整的模块。实际开发中，配合缓存，30行代码足够了！</p>
	<p><b style="color: blue">打印、预览和设计报表需要先下载并运行<a href="https://github.com/jslet/jslet/raw/master/report/JsletReport.exe" target="_blank">Jslet的报表助手</a>，如果暂不下载，可查看截图：
	<a href="preview.png" target="_blank">预览截图</a>
	<a href="print.png" target="_blank">打印截图</a>
	<a href="design.png" target="_blank">设计报表截图</a>
	</b></p>
	</div>

	<div style="border:1px solid gray;padding: 10px;border-radius: 5px">
		<div style="padding-left: 5px;margin-bottom: 10px">
	    <button class="btn btn-default btn-sm" id="btnQuery"> 查询 </button>
	    <div class="btn-group">
	    <button class="btn btn-default btn-sm" id="btnInputSetting"> 录入设置 </button>
	    <button class="btn btn-default btn-sm" id="btnAppend"> 新增 </button>
	    <button class="btn btn-default btn-sm" id="btnDelete"> 删除 </button>
	    <button class="btn btn-default btn-sm" id="btnBatchEdit"> 批量修改 </button>
	    <button class="btn btn-default btn-sm" id="btnSave"> 保存 </button>
	    </div>
	    <div class="btn-group">
	    <button class="btn btn-default btn-sm" id="btnImport"> 导入 </button>
	    <button class="btn btn-default btn-sm" id="btnExport"> 导出 </button>
	    </div>
	    <div class="btn-group">
	    <button class="btn btn-default btn-sm" id="btnPreview"> 预览 </button>
	    <button class="btn btn-default btn-sm" id="btnPrint"> 打印 </button>
	    <button class="btn btn-default btn-sm" id="btnDesign"> 设计报表 </button>
	    </div>
	    <button class="btn btn-default btn-sm" id="btnChart"> 图表分析 </button>
	    
	    </div>
	
	    <div class="form-horizontal" >
			<div class="form-group" style="margin-left:0">
			<div class="col-sm-10" style="padding-right: 20px">
	        <div data-jslet="type:'DBTable',dataset:'employee',hasSelectCol:true" style="height:200px"></div>
			</div>
			<div class="col-sm-2">
	          <img alt="employee phote" src="" data-jslet="type:'DBImage',dataset:'employee',field:'photo',baseUrl:'../photo/',enableViewer:true"
	              style="height: 160px; width: 140px" />
	        </div>
			</div>
	    </div>
		<!-- Employee Editor -->
		<div data-jslet="type: 'DBEditpanel', dataset:'employee', layout: [{field: 'summary', inFirstCol: true, dataCols: 11, height: 50}]" style="margin-top: 20px"></div>
	</div>
	<div>
	<hr />
	<div style="line-height: 2rem" class="demo-desc">
	<p>以上界面的拥有如下功能：</p>
	<ol>
	<li>基本操作: 查询、增加、删除、修改、保存，这些都是一行代码的事；</li>
	<li>打印、预览、报表设计也是一行代码的事情（需要先下载Jslet报表助手，并且先运行起来！）</li>
	<li>批量修改: 可对任何非唯一字段进行批量修改，当然也可指定某些字段；</li>
	<li>录入设置: 这可是快速录入的法宝，可以设置缺省值，可以设置从上一条录入的数据带入，如果字段很多，但经常录入的字段很少，就可设置录入项，按Tab键时，光标就只在设置的字段之间跳转了；</li>
	<li>导入：从Excel导入，数据初始化的利器；</li>
	<li>导出：导出数据到Excel；</li>
	<li>图表分析：以图表形式展示数据，有多种图表；</li>
	<li>复制到剪贴板：如果觉得导出比较麻烦，那就先点一下表格，然后“Ctrl + A”, “Ctrl + C” ，如果只是复制一部分，那就Ctrl + Mouse Click试试，跟Excel一样一样的。
	<li>查找数据：点击一下表格，按“CTRL + F”，或者右键一下表格；</li>
	<li>筛选数据：看到表格里的每个字段的列头里漏斗图标没，使劲点下去看看；</li>
	<li>排序：还是表格的列头，这下点字段名看看，再点一下，想按多个字段排序怎么办，那就CTRL+点击表头，你想按几个字段都可以的；</li>
	<li>合计：看看“姓名”和“工资”的列尾部；</li>
	<li>公式字段：看看“年龄”字段，通过“生日”字段计算出来的；</li>
	<li>上下文规则：看不懂，没关系，改变一下“性别”字段的值，然后点开“称呼”看看，如果“性别”是男的，怎么的也不允许输入“女士”进去吧；</li>
	<li>数据校验：想“工资”录入字母，NO！想录入重复的“姓名”和“编码”或者不录入，NO！年龄想小于18岁，没门！还有其它的，不一一列举了；</li>
	<li>最后看看源码：服务端交互，不用写任何代码的，什么JSON，什么AJax，统统不要，只需提供URL即可。</li>
	</ol>
	以上就是100行代码能实现上面的功能！
	</div>
	
	<script type="text/text" id="reportTemplate">
	<?xml version="1.0" encoding="utf-8" standalone="no"?>
	<TfrxReport Version="5.3.16" DotMatrixReport="False" EngineOptions.MaxMemSize="100" IniFile="D:\github\jsletreport\source\Win32\Release\\report.ini" PreviewOptions.Buttons="4095" PreviewOptions.Zoom="1" PrintOptions.Printer="预设" PrintOptions.PrintOnSheet="0" ReportOptions.CreateDate="42925.9437166782" ReportOptions.Description.Text="" ReportOptions.LastChange="42925.9624785764" ScriptLanguage="PascalScript" ScriptText.Text="begin&#13;&#10;&#13;&#10;end." StoreInDFM="False">
	  <Datasets>
	    <item DataSetName="员工信息"/>
	  </Datasets>
	  <TfrxDataPage Name="Data" Height="1000" Left="0" Top="0" Width="1000"/>
	  <TfrxReportPage Name="Page1" PaperWidth="210" PaperHeight="297" PaperSize="9" LeftMargin="10" RightMargin="10" TopMargin="10" BottomMargin="10" ColumnWidth="0" ColumnPositions.Text="" HGuides.Text="" VGuides.Text="">
	    <TfrxReportTitle Name="ReportTitle1" FillType="ftBrush" FillGap.Top="0" FillGap.Left="0" FillGap.Bottom="0" FillGap.Right="0" Height="71.81107" Left="0" Top="18.89765" Width="718.1107">
	      <TfrxMemoView Name="Memo1" Left="309.92146" Top="3.77953" Width="109.60637" Height="30.23624" Font.Charset="1" Font.Color="-16777208" Font.Height="-21" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="员工列表"/>
	      <TfrxMemoView Name="Memo18" Left="476.22078" Top="41.57483" Width="94.48825" Height="18.89765" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="打印日期:"/>
	      <TfrxMemoView Name="Memo19" Left="578.26809" Top="41.57483" Width="94.48825" Height="18.89765" DisplayFormat.FormatStr="yyyy-mm-dd" DisplayFormat.Kind="fkDateTime" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[Date]"/>
	    </TfrxReportTitle>
	    <TfrxPageHeader Name="PageHeader1" FillType="ftBrush" FillGap.Top="0" FillGap.Left="0" FillGap.Bottom="0" FillGap.Right="0" Height="30.23624" Left="0" Top="113.3859" Width="718.1107">
	      <TfrxShapeView Name="Shape2" Left="7.55906" Top="0" Width="672.75634" Height="30.23624"/>
	      <TfrxMemoView Name="Memo2" Left="34.01577" Top="7.55906" Width="49.13389" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="编码"/>
	      <TfrxMemoView Name="Memo3" Left="128.50402" Top="7.55906" Width="45.35436" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="姓名"/>
	      <TfrxMemoView Name="Memo4" Left="234.33086" Top="7.55906" Width="41.57483" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="部门"/>
	      <TfrxMemoView Name="Memo5" Left="336.37817" Top="7.55906" Width="45.35436" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="性别"/>
	      <TfrxMemoView Name="Memo6" Left="423.30736" Top="7.55906" Width="45.35436" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="年龄"/>
	      <TfrxMemoView Name="Memo7" Left="514.01608" Top="7.55906" Width="49.13389" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="薪水"/>
	      <TfrxLineView Name="Line7" Left="102.04731" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line8" Left="204.09462" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line9" Left="302.3624" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line10" Left="396.85065" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line11" Left="491.3389" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line12" Left="585.82715" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxMemoView Name="Memo8" Left="612.28386" Top="7.55906" Width="52.91342" Height="18.89765" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="职位"/>
	    </TfrxPageHeader>
	    <TfrxMasterData Name="MasterData1" FillType="ftBrush" FillGap.Top="0" FillGap.Left="0" FillGap.Bottom="0" FillGap.Right="0" Height="30.23624" Left="0" Top="204.09462" Width="718.1107" ColumnWidth="0" ColumnGap="0" DataSetName="员工信息" RowCount="0">
	      <TfrxShapeView Name="Shape1" Left="7.55906" Top="0" Width="672.75634" Height="30.23624"/>
	      <TfrxLineView Name="Line1" Left="102.04731" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line2" Left="204.09462" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line3" Left="302.3624" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line4" Left="396.85065" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line5" Left="491.3389" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxLineView Name="Line6" Left="585.82715" Top="0" Width="0" Height="30.23624" Color="0" Diagonal="True"/>
	      <TfrxMemoView Name="Memo9" Left="15.11812" Top="7.55906" Width="79.37013" Height="18.89765" DataField="编码" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;编码&#34;]"/>
	      <TfrxMemoView Name="Memo10" Left="113.3859" Top="7.55906" Width="79.37013" Height="18.89765" DataField="姓名" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;姓名&#34;]"/>
	      <TfrxMemoView Name="Memo11" Left="211.65368" Top="7.55906" Width="79.37013" Height="18.89765" DataField="部门" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;部门&#34;]"/>
	      <TfrxMemoView Name="Memo12" Left="317.48052" Top="7.55906" Width="79.37013" Height="18.89765" DataField="性别" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;性别&#34;]"/>
	      <TfrxMemoView Name="Memo13" Left="408.18924" Top="7.55906" Width="79.37013" Height="18.89765" DataSetName="员工信息" DisplayFormat.FormatStr="%g" DisplayFormat.Kind="fkNumeric" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;年龄&#34;]"/>
	      <TfrxMemoView Name="Memo14" Left="498.89796" Top="7.55906" Width="79.37013" Height="18.89765" DataSetName="员工信息" DisplayFormat.FormatStr="%2.2n" DisplayFormat.Kind="fkNumeric" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;薪水&#34;]"/>
	      <TfrxMemoView Name="Memo15" Left="597.16574" Top="7.55906" Width="79.37013" Height="18.89765" DataField="职位" DataSetName="员工信息" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[员工信息.&#34;职位&#34;]"/>
	    </TfrxMasterData>
	    <TfrxReportSummary Name="ReportSummary1" FillType="ftBrush" FillGap.Top="0" FillGap.Left="0" FillGap.Bottom="0" FillGap.Right="0" Height="41.57483" Left="0" Top="294.80334" Width="718.1107">
	      <TfrxMemoView Name="Memo16" Left="498.89796" Top="11.33859" Width="79.37013" Height="18.89765" DataSetName="员工信息" DisplayFormat.FormatStr="%2.2n" DisplayFormat.Kind="fkNumeric" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="[SUM(&#60;员工信息.&#34;薪水&#34;&#62;,MasterData1)]"/>
	      <TfrxMemoView Name="Memo17" Left="396.85065" Top="11.33859" Width="94.48825" Height="18.89765" Font.Charset="1" Font.Color="-16777208" Font.Height="-16" Font.Name="宋体" Font.Style="0" ParentFont="False" Text="合计:"/>
	    </TfrxReportSummary>
	  </TfrxReportPage>
	</TfrxReport>	
	
	</script>
	
	
	<h3>Source</h3>
	<h4>1、HTML控件定义，全部定义信息在属性：data-jslet</h4>
    <pre class="prettyprint linenums lang-html"><code>

Employee List:
        &lt;div data-jslet="type:'DBTable',dataset:'employee',hasSelectCol:true,rowHeight:25"
        &lt;/div&gt;

Employee Photo:
        &lt;img data-jslet="type:'DBImage',dataset:'employee',field:'photo',baseUrl:'../photo/'" 
		    alt="employee phote" src=""/&gt;

Employee Editor：
        &lt;div data-jslet="type:'DBEditPanel',dataset:'employee', layout: [{field: 'summary', inFirstCol: true, dataCols: 11, height: 50}]"&gt;
        &lt;/div&gt;
	</code></pre>

	<h4>2、Glance.js</h4>
    <pre class="prettyprint linenums"><code>
	/********************************** 定义数据集 ************************************************/
	//datasetMetaStore定义在公共js:common/datasetmetastore.js中
	var getMeta = datasetMetaStore.getDatasetMeta;
	//创建“性别”数据集
    var dsGender = new jslet.data.Dataset(getMeta('gender'));

    //创建“职位”
    var dsPosition = new jslet.data.Dataset(getMeta('position'));
    
    //创建“称呼”，称呼有性别之分
    var dsSalutation = new jslet.data.Dataset(getMeta('salutation'));

    //创建“省份”数据集
    var dsProvince = new jslet.data.Dataset(getMeta('province'));

    //创建“部门”数据集
    var dsDept = new jslet.data.Dataset(getMeta('department'));

    //创建“员工信息”数据集
    var dsEmployee = new jslet.data.Dataset(getMeta('employee'));
	dsEmployee.enableContextRule();
	
	/********************************** 结束定义数据集 ************************************************/
	
	//绑定按钮事件
	$('#btnQuery').click(function() {
		dsEmployee.query();	
	});
	$('#btnAppend').click(function() {
		dsEmployee.appendRecord();	
	});
	$('#btnDelete').click(function() {
		dsEmployee.deleteRecord();	
	});
	$('#btnSave').click(function() {
		dsEmployee.submit();	
	});
	$('#btnImport').click(function() {
		var importDlg = new jslet.ui.ImportDialog('employee');
		importDlg.show();
	});
	$('#btnExport').click(function() {
		var exportDlg = new jslet.ui.ExportDialog('employee');
		exportDlg.show('employee.xlsx');
	});

	$('#btnInputSetting').click(function() {
		jslet.ui.defaultInputSettingDialog.show('employee');
	});
	$('#btnBatchEdit').click(function() {
	    var dialog = new jslet.ui.BatchEditDialog('employee');
	    dialog.show();
	});

	$('#btnChart').click(function() {
		var chartDlg = new jslet.ui.ChartDialog('employee', {categoryField: 'name'});
		chartDlg.show();
	});

	//创建控件，创建完成后，查询数据
	jslet.ui.install(function() {
		dsEmployee.query(); 
	});
	</code></pre>

	<h4>3、common/DatasetMetaStore.js</h4>
	<h5>此文件存放数据集的定义信息，实际开发此文件存入数据库，并写入缓存中。此文件为普通Js文件，不依赖jslet。</h5>
    <pre class="prettyprint linenums"><code>
    var metaStore = []; 
	
	//“性别”
    metaStore.push({name: 'gender', isEnum: true, records: 'F:女,M:男,U:未知'});

    //“职位”
    metaStore.push({name: 'position', isEnum: true, records: '0:总经理,1:经理,2:主管,3:员工'});
    
    //“货币”
    metaStore.push({name: 'currency', description: '货币', isEnum: true, records: 'RMB:人民币,USD:美元,HKD:港币'});
    
    //创建“称呼”，称呼有性别之分
    var salutationFldCfg =[
      { name: 'code', dataType: 'S', length: 2, label: '称呼编码'},
  	  { name: 'name', dataType: 'S', length: 30, label: '称呼名称'},
  	  { name: 'gender', dataType: 'S', length: 2, label: '性别'}
  	];
    
    var records = [{code:'Sir', name:'先生', gender: 'M'}, {code:'Gentleman', name:'阁下', gender: 'M'},
           	  	{code:'Mr', name:'兄弟', gender: 'M'}, {code:'Miss', name:'小姐', gender: 'F'}, {code:'Madam', name:'女士', gender: 'F'},
        	  	{code:'Mrs', name:'姐妹', gender: 'F'}, {code:'Dr', name:'老人家', gender: 'B'}
        	];
    
    metaStore.push({name: 'salutation', fields: salutationFldCfg, keyField: 'code',  nameField: 'name', records: records});

    //“省份”
    metaStore.push({name: 'province', isEnum: true, records:
    		'01:安徽,02:北京,03:福建,04:甘肃,05:广东,06:广西,07:贵州,08:海南,09:河北,10:河南,11:黑龙江,12:湖北,'+
             '13:湖南,14:吉林,15:江苏,16:江西,17:辽宁,18:内蒙古,19:宁夏,20:青海,21:山东,22:山西,23:陕西,24:上海,'+
             '25:四川,26:天津,27:西藏,28:新疆,29:云南,30:浙江,31:重庆'});

    //"部门"
    var deptFldCfg = [
       {name: 'deptid', dataType: 'S', length: 6, label: '部门编码'}, 
       {name: 'name', dataType: 'S', length: 15, label: '部门名称'}, 
       {name: 'address', dataType: 'S', length: 20, label: '部门地址'}, 
       {name: 'parentid', dataType: 'S', length: 6, label: '父级部门编码', visible:false}];

    var data = [{deptid: '00', name: '行政部', address: '深圳'}, 
                {deptid: '01',  name: '市场部', address: '北京'}, 
                {deptid: '0101', name: '成都分部', address: '成都', parentid: '01'}, 
                {deptid: '0102', name: '上海分部', address: '上海', parentid: '01'}, 
                {deptid: '02', name: '研发部', address: '深圳'}, 
                {deptid: '0201', name: '研发一部', address: '深圳', parentid: '02'}, 
                {deptid: '0202', name: '研发二部', address: '深圳', parentid: '02'}, 
                {deptid: '03', name: '质量部', address: '深圳'}, 
                {deptid: '03', name: '财务部', address: '深圳'}];

    metaStore.push({name: 'department', fields: deptFldCfg, 
		keyField: 'deptid',codeField: 'deptid', nameField: 'name', 
		parentField: 'parentid', autoRefreshHostDataset: true,
		records: data});


    //"员工信息"
    var fldCfg = [
       {name: 'id', dataType: 'S', length: 11, label: '编码', required: true, tip: '编码不得重复!', unique: true}, 
       {name: 'name', dataType: 'S', length: 15, label: '姓名', required: true, unique: true, aggraded: true, tip: '名称不得重复!'}, 
       {name: 'department', dataType: 'S', length: 10, label: '部门', dislayWidth: 16, required: true, lookup: {dataset: 'department'}, editControl: 'DBComboSelect'}, 
       {name: 'gender', dataType: 'S', length: 4, label: '性别', lookup: {dataset: 'gender'}},
       {name: 'salutation', dataType: 'S', length: 10, label: '称呼', displayWidth: 6, lookup: {dataset: 'salutation'}},
       {name: 'age', dataType: 'N', length: 6, label: '年龄', displayWidth: 6, dataRange: {min: 18, max: 60 }, formula: '(new Date()).getFullYear() - ([birthday]?[birthday].getFullYear(): 0)'},
       {name: 'married', dataType: 'B', label: '婚否', trueValue: 1, falseValue: 0, displayWidth: 10},
       {name: 'birthday', dataType: 'D', label: '生日', displayFormat: 'yyyy-MM-dd', dataRange: {min: new Date(1960, 1, 1)}},
       {name: 'position', dataType: 'S', length: 10, label: '职位', lookup: {dataset: 'position'}},
       {name: 'salary', dataType: 'N', length: 16, scale: 2, label: '薪水', displayFormat: '￥#,##0.##', aggraded: true},
       {name: 'university', dataType: 'S', length: 20, label: '毕业院校'},
       {name: 'province', dataType: 'S', length: 10, label: '省份', lookup: {dataset: 'province'}, editControl: 'DBComboSelect'},
       {name: 'city', dataType: 'S', length: 8, label: '城市', visible: false},
       {name: 'photo', dataType: 'S', length: 10, label: '照片'},
       {name: 'officePhone', dataType: 'S', length: 12, label: '公司电话', 
    	   		regularExpr: /(\(\d{3,4}\)|\d{3,4}-|\s)?\d{8}/ig, regularMessage: '无效电话号码!', tip: '格式:999-99999999'},
       {name: 'cellPhone', dataType: 'S', length: 12, label: '手机', 
    	   		regularExpr: /(\(\d{3,4}\)|\d{3,4}-|\s)?\d{8}/ig, regularMessage: '无效手机号码!', tip: '"1"+10 数字'},
       {name: 'email', dataType: 'S', length: 50, label: 'Email', displayWidth: 20, 
    	   		regularExpr: /^[a-zA-Z_0-9-'\+~]+(\.[a-zA-Z_0-9-'\+~]+)*@([a-zA-Z_0-9-]+\.)+[a-zA-Z]{2,7}$/ig, regularMessage: '无效 Email地址!', tip: 'foo@foo.com'},
       {name: 'idcard', dataType: 'S', length: 18, label: '省份证号', 
    	   		regularExpr: /\d{18}/ig, regularMessage: '无效身份证号, 须18位数字!', tip: '18数字'},
       {name: 'summary', dataType: 'S', length: 200, label: '备注', displayWidth: 20} 
    ];

    //创建规则：“称呼”字段的可选项根据“性别”字段值进行变化
	var rule1 = {condition: '[gender]', rules: [{field: 'salutation', lookup: {filter: '[gender] == "${gender}" || [gender] == "B"'}}]};

	metaStore.push({name: 'employee', fields: fldCfg, keyField: 'id',
    	queryUrl: '/demo/employee/findall', submitUrl: '/demo/employee/save',
    	contextRules: [rule1]});
	
	//根据数据集名称查找数据集的定义信息
    function getDatasetMeta(dsName) {
    	var meta;
    	for(var i = 0, len = metaStore.length; i < len; i++) {
    		meta = metaStore[i];
    		if(meta.name == dsName) {
	    		return meta;
    		}
    	}
    };
    
    window.datasetMetaStore = {getDatasetMeta: getDatasetMeta};
    return window.datasetMetaStore;
	</code></pre>
	
    <script type="text/javascript">
       window.LOADER_BASE_URL = "../lib/prettify";
    </script>
    <script type="text/javascript" src="../lib/prettify/run_prettify.js"></script>
		
</body>
</html>
